﻿
$(function () {
    echarts_1();
    echarts_4();
    
    echarts_5();
    // echarts_6();
    function echarts_1() {
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('echart1'));
        var option = {
            title: {
                text: ''
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross',
                    label: {
                        backgroundColor: '#6a7985'
                    }
                }
            },
            legend: {
                data: ['0-59', '60-70', '71-80', '81-90', '91-100'],
                textStyle: {
                    color: "rgba(255,255,255,.6)",
                    fontSize: '12',
                },

            },
            toolbox: {
                feature: {
                    saveAsImage: {}
                }
            },
            grid: {
                left: '3%',
                right: '6%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: [
                {
                    type: 'category',
                    boundaryGap: false,
                    data: ['1790012', '1790010', '1790001', '1790003', '1790011',],
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: "rgba(255,255,255,.1)",
                            width: 1,
                            type: "solid"
                        },
                    },

                    axisTick: {
                        show: false,
                    },
                    axisLabel: {
                        interval: 0,
                        // rotate:50,
                        show: true,
                        splitNumber: 15,
                        textStyle: {
                            color: "rgba(255,255,255,.6)",
                            fontSize: '12',
                        },
                    },
                }],
            yAxis: [
                {
                    type: 'value',
                    axisLabel: {
                        //formatter: '{value} %'
                        show: true,
                        textStyle: {
                            color: "rgba(255,255,255,.6)",
                            fontSize: '12',
                        },
                    },
                    axisTick: {
                        show: false,
                    },
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: "rgba(255,255,255,.1	)",
                            width: 1,
                            type: "solid"
                        },
                    },
                    splitLine: {
                        lineStyle: {
                            color: "rgba(255,255,255,.1)",
                        }
                    }
                }
            ],
            series: [

                {
                    name: '0-59',
                    type: 'line',
                    stack: '总量',
                    areaStyle: {},
                    data: [12, 32, 10, 34, 9, 23, 21]
                },
                {
                    name: '60-70',
                    type: 'line',
                    stack: '总量',
                    areaStyle: {},
                    data: [22, 18, 19, 23, 29, 33, 31]
                },
                {
                    name: '71-80',
                    type: 'line',
                    stack: '总量',
                    areaStyle: {},
                    data: [15, 23, 20, 15, 19, 33, 4]
                },
                {
                    name: '81-90',
                    type: 'line',
                    stack: '总量',
                    areaStyle: {},
                    data: [20, 32, 31, 34, 39, 30, 10]
                },
                {
                    name: '91-100',
                    type: 'line',
                    stack: '总量',
                    label: {
                        normal: {
                            show: true,
                            position: 'top'
                        }
                    },
                    areaStyle: {},
                    data: [20, 32, 1, 34, 12, 13, 12],
                },

            ]
        };
        myChart.setOption(option);
        window.addEventListener("resize", function () {
            myChart.resize();
        });

    }
   
    function echarts_5() {
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('echart5'));

        option = {
            title: {
                text: '',
                subtext: '',
                left: 'center'
            },
            tooltip: {
                trigger: 'item',
                formatter: '{a} <br/>{b} : {c} ({d}%)'
            },
            legend: {
                orient: 'vertical',
                left: 'left',
                textStyle:{
                    color: "rgba(255,255,255,.6)",
                    fontSize: '12',
                },
                data: ['差', '合格', '一般', '良好', '优秀']
            },
            series: [
                {
                    name: '访问来源',
                    type: 'pie',
                    radius: '55%',
                    center: ['50%', '60%'],
                    data: [
                        {value: 335, name: '差'},
                        {value: 310, name: '合格'},
                        {value: 234, name: '一般'},
                        {value: 135, name: '良好'},
                        {value: 1548, name: '优秀'}
                    ],
                    emphasis: {
                        itemStyle: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };
        
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
        window.addEventListener("resize", function () {
            myChart.resize();
        });
    }

   
    
   

})


















